<template>
	<view ref="tagTip" class="tag-tip" :style="'width:'+ width +'px; left:'+ left + 'px; top:' + top + 'px; display:' + display +'; opacity: ' + opacity +';'" >
		<view class="txt">{{title}}</view>
		<view class="item" v-for="(item,index) in list" :key="index">{{item.title}}</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				title:"",
				left:0,
				top:0,
				opacity: 0,
				display:'none',
				width:'auto',
				list:[],
			}
		},
		methods:{
			showTip(data)
			{
				this.display = data.display;
				if(data.display == "none")
				{
					this.opacity = 0;
					return;
				}
				this.title = data.title;
				this.top = data.top;
				this.list = data.list;
				let that = this;
				setTimeout(function(){
					that.left = data.left - Math.floor(that.$el.offsetWidth / 2) + 20;
					that.opacity = 1;
				},100);
			}
		},
	}
</script>

<style lang="scss">
	
</style>
